
@mainColor: #ff783e;


/* 超出元素的多余文字不换行，将多余部分替换成... */
.overflow(@line:1) {
    & when(@line=1) {
        white-space: nowrap;
    }
    overflow: hidden;
    text-overflow: ellipsis;
    & when(@line>1) {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: @line;
    }
}

.imgoverhidden() {
    overflow: hidden;
    position:relative;
    z-index:1;
}

button::after { border: none }

/* 多行文字省略 */
.multi-overflow(@line) {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: @line;
}

/* 背景色渐变 */
.gradient(@colorStar, @colorEnd, @direction:to right, @starX:0%, @starY:100%, @type:linear, @clip:background) {
  background: ~"@{type}-gradient(@{direction}, @{colorStar} @{starX}, @{colorEnd} @{starY})";
  & when (@clip=text) {
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
  }
}

.align(@position, @direction:1) {
  display: flex;
  & when (@position=v-center), (@position=center) {
      flex-wrap: wrap;
      align-items: center;
      align-content: center;
  }
  & when (@position=h-center), (@position=center) {
      justify-content: center;
  }
  & when (@position=top) {
      align-items: flex-start;
  }
  & when (@position=bottom) {
      align-items: flex-end;
  }
  & when (@position=left) {
      justify-content: flex-start;
  }
  & when (@position=right) {
      justify-content: flex-end;
  }
  & when (@position=h-space-between), (@position=v-space-between) {
      justify-content: space-between;
  }
  & when (@position=h-space-around), (@position=v-space-around) {
      justify-content: space-around;
  }
  & when (@position=v-space-between), (@position=v-space-around) {
      flex-direction: column;
  }
  & when (iskeyword(@direction)) {
      flex-direction: @direction;
  }
}

.mar-b10{
    margin-bottom: 10rpx;
}